<template>
    <div>
        <div class="head">
        <div @click="fn1"><i class="iconfont icon-icon-test1"></i></div>
        <span>购物车</span>
        <span style="width: 10%;" @click="fn1">完成</span>
    </div>
    <div class="cartlist">
        <div class="list" v-for="(item,index) in carlist"
            :key="index">
           <div class="list_b" 
           >
                <input type="checkbox" @click="ischeck(index)"
                    :checked="item.isCheck?'checked':''"
                >
               <img :src="item.imageUrl" alt="">
                 <div class="list_r">
                   <p>{{item.uName}}</p>
                   <p>{{item.name}}</p>
                   <p>{{item.color}} 40</p>
                   <div>
                    <span>￥{{item.price}}</span>
                    <div class="calc">
                        <span @click="reduce(index)">-</span>
                        <span>{{item.num}}</span>
                        <span @click="plus(index)">+</span>
                    </div>
                   
                   </div>          
               </div>
           </div>
            
        </div>
    </div>
   <div class="cartlist_foot">
        <input type="checkbox" name="" id=""
            :checked="allCheck.allCheck?'checked':''"
            @click="all(allCheck.allCheck)"
        >
        <span >全选</span>
        <p :class="allCheck.onecheck?'jh':''">删除</p>
   </div>
    </div>
</template>

<script>
    import {mapState} from 'vuex'
    import {mapGetters} from 'vuex'
    import {mapMutations} from 'vuex'
    export default {
        data() {
            return {
               
            }
        },
        computed: {
            ...mapState({
               carlist:state=>state.car.carList
            }),
             ...mapGetters({
                allCheck:'car/allCheck',
            })
        },
        methods: {
            ...mapMutations({
                ischeck:'car/checkMut',
                all:'car/all',
                plus:'car/plus',
                reduce:'car/reduce'
            }),
            fn1() {
                this.$router.go(-1)
            },
           
        },
    }
</script>

<style lang="scss" scoped>
@import url(../assets/css/cartlist.css);
@import url(../assets/font_q2zhw7no3h/iconfont.css);
</style>